import React from 'react'
import "./index.scss";
import FirstEchart from './conponent/firstEchart';
import ChartContentBox from './conponent/ChartContentBox';
import ChartSwitch from './conponent/chartSwitch';
import useReducer from 'src/hooks/useReducer';
import { useHistory } from 'react-router-dom';

export default function EchartPage() {
  const history = useHistory()
  const [state,dispatch] = useReducer ({
    switchType: '1',
    curType:''
  })
  const {switchType,curType} = state;
  return (
    <div className='my-echart'>
         <div className='e-header'>
            <div onClick={ ()=> history.goBack()}></div>
           <span>Echart模块</span>
         </div>
         <div className='e-content'>
            <div>
                <FirstEchart />
            </div>
            {/* <div className='ceshi'>
              11
            </div> */}
            <div className='histogram'>
                <div style={{position:'absolute',top:'0',right:'100px',zIndex:'8'}}>
                   <ChartSwitch 
                   switchType={switchType}
                   handleChangeChart ={(e) => {
                    dispatch({
                      switchType: e
                    })
                   }}
                   />
                </div>
               <div>
                  <ChartContentBox switchType={switchType}></ChartContentBox>
               </div>
            </div>
         </div>
    </div>
  )
}
